<template>
   <div>
      <!--头部导航-->
      <header-nav></header-nav>
      <!-- 主体内容 -->
      <body-content :crumbs-nav="crumbs"
                    :nav-selector="navSelector"
                    :style-string="styleImg"
                    :url-string="url"
      >
      </body-content>
      <!--底部内容-->
      <m-footer></m-footer>
      <srcollTo></srcollTo>
   </div>
</template>

<script>
   import HeaderNav from '../../base/header-nav/header-nav'
   import BodyContent from '../../components/body-content-common/body-content-common'
   import MFooter from '../../base/meizu-footer-wrap/meizu-footer-wrap'
   import {mapActions, mapGetters, mapMutations} from 'vuex'

   export default {
      name: 'intelligentdevices',
      data() {
         return {
            crumbs: [
               {id: 1, NavName: '首页', path: '/'},
               {id: 2, NavName: '全部商品', path: ''},
               {id: 3, NavName: '数码影音', path: ''}
            ],
            navSelector: [
               [
                  {
                     id: 1,
                     NavName: '分类 :',
                     path: ''
                  },
                  {
                     id: 2,
                     NavName: '全部',
                     path: '',
                     field: 'classification'
                  },
                  {
                     id: 3,
                     NavName: '耳机',
                     field: 'classification',
                     path: ''
                  },
                  {
                     id: 4,
                     NavName: '音箱',
                     field: 'classification',
                     path: ''
                  },
                  {
                     id: 5,
                     NavName: '播放器',
                     field: 'classification',
                     path: ''
                  },
               ],
               [
                  {
                     id: 1,
                     NavName: '品牌 :',
                     path: ''
                  },
                  {
                     id: 2,
                     NavName: '全部',
                     path: '',
                     field: 'brand'
                  },
                  {
                     id: 3,
                     NavName: '魅族',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 4,
                     NavName: '魅蓝',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 5,
                     NavName: '铁三角',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 6,
                     NavName: 'JBL',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 7,
                     NavName: 'Beats',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 8,
                     NavName: '先锋',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 9,
                     NavName: '捷波朗',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 9,
                     NavName: 'JVC',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 9,
                     NavName: '索尼',
                     field: 'brand',
                     path: ''
                  },
                  {
                     id: 9,
                     NavName: '骷髅头',
                     field: 'brand',
                     path: ''
                  }
               ]
            ],
            CommodityDisplayData: [],
            styleImg: `height:220px;width:220px`,
            url: '/apis/navigation/electronics'
         }
      },
      computed: {
         ...mapGetters([
            'displayFooter',
            'contentClose',
            'loginMessage',
            'navigationField'
         ])
      },
      created() {
         // this.setCLEAR_DATAILSPAGEDATA()
      },
      mounted() {
         this.setIphonesData({
            url: this.url
         })
         this._setGetUrl(this.url)
         this._userCo()
         this.setNavigationField('')
         console.log(this.navigationField)
      },
      methods: {
         async _userCo() {
            if (!this.loginMessage) {
               return
            }
            let doc = await this.$axios.post('/apis/collection/collection', {
               find: true,
               id: this.loginMessage.user._id
            })

            if (doc.data.success) {
               let arr = doc.data.result.collections
               this.setUerCollection(arr)
            }
         },
         ...mapActions({
            setIphonesData: 'setData'
         }),
         ...mapMutations({
            _setGetUrl: 'getUrl',
            setUerCollection: 'userCollection',
            setNavigationField: 'navigationField',
            setCLEAR_DATAILSPAGEDATA: 'clear_DetailsPageData'
         })
      },
      components: {
         HeaderNav,
         BodyContent,
         MFooter
      }
   }
</script>
